<template>
	<view class="region-picker-box">
		<uni-data-picker :localdata="localdata" v-model="region" placeholder="请选择地址" popup-title="请选择地址" 
		@change="onchange" :clear-icon="false" :border="false" :step-searh="false">
		</uni-data-picker>
	</view>
</template>

<script lang="ts" setup>
	import {onMounted, ref} from "vue"
import { getRegionData } from "@/api/public";
	const props = defineProps({
		level:{
			type:Number,
			default:3			//1只有省 2到市 3到县
		},
		needProvince:{			//是否必须选择某一个省，如果为false，可选全国/不限
			type:Boolean,
			default:true,
		},
		needCity:{
			type:Boolean,
			default:true,
		},
		needArea:{
			type:Boolean,
			default:true,
		},
		default:{
			type:Number,
			default:0			//默认值
		}
	})
	const localdata = ref<any[]>([])
	const region = ref(0)
	const emits = defineEmits()
	onMounted(async ()=>{
		let data = {
			levet:props.level,
			needProvince:props.needProvince?1:0,
			needCity:props.needCity?1:0,
			needArea:props.needArea?1:0,
		}
		await getRegionData(data).then((res:any)=>{
			localdata.value = res.data
		})
		region.value = props.default
	})
	const onchange = async (e:any)=>{
		emits("change",e.detail.value.map((item:any)=>{
			if(item.value.includes("_")){
				item.value = 0
			}
			return item
		}))
	}
</script>

<style lang="scss" scoped>
.region-picker-box{
	
}
</style>